<template>
    <div style="font-size: 12px;  line-height: 60px; display: flex">
        <div style="flex: 1; font-size: 20px">
            <span :class="collapseBtnClass" style="cursor: pointer" @click="collapse"></span>


        </div>
        <el-dropdown style="width: 100px; cursor: pointer">
            <div style="display: inline-block">
                <img :src="Inuser.avatarUrl" alt=""
                     style="width: 30px; height: 35px; border-radius: 50%; position: relative; top: 10px; right: 5px">
            <span>{{Inuser.nickname}}</span><i class="el-icon-arrow-down" style="margin-left: 5px"></i>

            </div>
            <el-dropdown-menu slot="dropdown">
                <el-dropdown-item>
                <router-link to="person" style="text-decoration: none">个人信息</router-link>
                </el-dropdown-item>
                <span style="text-decoration: none" @click="out"><el-dropdown-item>退出</el-dropdown-item></span>
            </el-dropdown-menu>
        </el-dropdown>
    </div>
</template>

<script>
    export default {
        name: "Header",
        props:{
            collapseBtnClass:String,
            collapse:Boolean
        },
        data(){
            return{
                Inuser:JSON.parse(localStorage.getItem("Inuser"))
            }
        },
        methods:{
            out(){
                this.$router.push("/login")
                localStorage.removeItem("Inuser")
                this.$message.success("退出成功")
            }
        }

    }
</script>

<style scoped>

</style>